
import { DirectiveBinding, VNode } from 'vue';
export default {
  name: 'wSize',
  mounted(el: Element, binding: DirectiveBinding, vnode: VNode) {
    let startX = 0
    el.addEventListener('mousedown', (e: Event) => {
      e.preventDefault()
      const mouseEvent = e as MouseEvent;
      startX = mouseEvent.clientX
      window.addEventListener('mousemove', mousemoveHandler)
    })
    window.addEventListener('mouseup', (e: Event) => {
      e.preventDefault()
      window.removeEventListener('mousemove', mousemoveHandler)
    })
    const mousemoveHandler = (e: Event) => {
      e.preventDefault()
      const mouseEvent = e as MouseEvent;
      const len = mouseEvent.clientX - startX;
      const moveLenFn = binding.value;
      moveLenFn(len);
    };
  }
}
